<div class="header">
    Add New {{state}} Role
</div>
<br>
<div class="content">
    <form class="ui {{if isLoading 'loading'}} form" id="add-system-role-form" autocomplete="off" {{action 'checkEmail' on='submit'
        preventDefault=true}}>
        <div class="field">
            <label class="required">
                Email
            </label>
            {{input type='text' name='role_email' value=roleEmail placeholder='Enter Role Email'}}
        </div>
    </form>
</div>
<br> {{#if userFounded}}
<table class="ui celled table">
    <thead>
        <tr>
            <th>User Information</th>
            <th>Actions</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>
                <h5>{{userFounded.email}}</h5>
                <p>{{userFounded.username}}</p>
                <p>{{userFounded.created_at}}</p>
            </td>
            <td>
                {{#if (if-equal state 'Admin')}}
                    <tr>{{ui-checkbox class="toggle" label="Enable Admin Role" checked=admin_checked onChange=(action (mut admin_checked))}}</tr>
                {{else}}
                    <tr>{{ui-checkbox class="toggle" label="Enable Sales Role" checked=sales_checked onChange=(action (mut sales_checked))}}</tr>
                {{/if}}
            </td>
        </tr>
    </tbody>
</table>
{{/if}}
<div class="actions">
    <button type="button" class="ui black button" {{action 'close'}}>
        Cancel
    </button>
    {{#if userFounded}}
    <button type="submit" {{action 'addSystemRole'}} class="ui green right labeled icon button">
        Save
        <i class="checkmark icon"></i>
    </button>
    {{else}}
    <button type="submit" form="add-system-role-form" class="ui blue button">
        Check
    </button>
    {{/if}}
</div>
